<div class="comment">
  <div class="comment-header">
    <ul>
      <li>评论设置</li>
      <li>评论列表</li>
    </ul>
  </div>  
  <div class="tab-content">
    <div class="comment-table_set">
      <table class="table table-bordered">
        <thead>
          <tr>
            <th>编号</th>
            <th>文章标题</th>
            <th>评论者</th>
            <th>发布时间</th>
            <th>评论内容</th>
            <th>评论状态</th>
          </tr>
        </thead>
      </table>
      <div class="comment-set-content">
        <table class="table table-bordered">
          <tbody>
  
          </tbody>
        </table>
      </div>
    </div>
    <div class="comment-table_list">
      <table class="table table-bordered">
        <thead>         
          <tr>
            <th>编号</th>
            <th>所属文章</th>
            <th>评论内容</th>
            <th>评论者</th>
            <th>评论时间</th>
            <th>状态</th>
            <th>操作</th>
          </tr>
        </thead>
      </table>
      <div class="comment-list-content">
        <table class="table table-bordered">
          <tbody>
  
          </tbody>
        </table>
      </div>
    </div>
  </div>
  <div id="commentPage" class="demo"></div>
</div>
<script>
  //审核
  $('.comment-set-content').on('click','.passBtn',function(){
      // 获取当前点击的文章id
      var id = $(this).closest('tr').find('[type=checkbox]').val();
      console.log(id);
      myAjax('/manager/comment/checkComment','get',{
          id:id,
          status:'审核通过'
      },function(res){
          if(res.status == 200){
            alert(res.message)
            // 更新数据
            findAll(0)
          } else {
            alert('审核失败！')
          }
      })
    })
  //实现页面交互
  $(function(){
    $('.comment-header li').click(function(){
      let text = $(this).text();
      // console.log(text);
      if(text == '评论设置'){
        $('.comment-header li:first-child').css({
          border:'1px solid #e2e2e2',
          borderBottom:'none'
        });
        $('.comment-header li:nth-child(2)').css('border','none');
        $('.comment-table_set').css('display','block');
        $('.comment-table_list').css('display','none');
      }else if(text == '评论列表'){
        $('.comment-header li:first-child').css('border','none');
        $('.comment-header li:nth-child(2)').css({
          border:'1px solid #e2e2e2',
          borderBottom:'none'
        });
        $('.comment-table_set').css('display','none');
        $('.comment-table_list').css('display','block');
;
      }
    })
    $('.comment-header li:first-child').click();
  })
  findAll(0);
  //获取栏目数据，遍历数据，生成表格
  function findAll(page){
    $('.comment tbody').empty();
    myAjax('/manager/comment/findComment','get',{page:page,pageSize:5},function(res){
      res.data.list.forEach(function(item) {
        var $tr = $(`
        <tr>
          <td><input type="checkbox" value="`+item.id+`"></td>
          <td>`+(item.article?item.article.title:'--')+`</td>
          <td>`+((item.customer !=null)?item.customer.username:'--')+`</td>
          <td>`+((item.article !=null)?item.article.publishtime:'--')+`</td>
          <td>`+item.content+`</td>
          <td>`+(item.status == '审核通过' ? item.status : '<button class="btn btn-info passBtn">审核</button>' )+`</td>
        </tr>
        `);
        var $ttr = $(`
        <tr>
          <td><input type="checkbox" value="`+item.id+`"></td>
          <td>`+((item.article !=null)?item.article.title:'--')+`</td>
          <td>`+item.content+`</td>
          <td>`+((item.customer !=null)?item.customer.username:'--')+`</td>
          <td>`+item.commenttime+`</td>
          <td>`+item.status+`</td>
          <td>
            <span class="comment-delete"><i class="fa fa-trash-o" title="删除"></i></span>
          </td>
        </tr>
        `);
        $('.comment-set-content tbody').append($tr);
        $('.comment-list-content tbody').append($ttr);
      });
      $("#commentPage").sPage({
              page:res.data.page+1,
              pageSize:res.data.pageSize,
              total:res.data.total,
              prevPage:"←",
              nextPage:"→",
              backFun:function(page){
                // page为当前点击的页码
                findAll(page-1)
              }
            });
    });
  }

  //删除  事件代理
  $('.comment-list-content').on('click','.comment-delete',function(){
    var id = $(this).closest('tr').find('[type=checkbox]').val();
    console.log(id)
    var result = confirm('这项操作会使导致数据丢失，你确定要进行此操作吗？')
    if(result){
      myAjax('/manager/comment/saveOrUpdateComment', 'post', { id: id }, function (res) {
        if (res.status == 200) {
          // alert('删除成功');
          // 更新页面的数据
          findAll(0);
          $("#commentPage").sPage({
            page:res.data.page+1,
            pageSize:res.data.pageSize,
            total:res.data.total,
            prevPage:"←",
            nextPage:"→",
            backFun:function(page){
              // page为当前点击的页码
              findAll(page-1)
            }
          });
        } else {
          alert('删除失败');
        }
      }, function (err) {
        alert('删除失败');
      });
    }
  })
</script>


